<template>
	<view class="navBarCustom">
		<uni-nav-bar v-if="scanType === '0'" shadow @clickLeft="back" color="#fff" background-color="#52B5AD" :title="title"
			v-bind="$attrs" @clickRight="clickRightFn" :border="false"></uni-nav-bar>
		<uni-nav-bar v-if="scanType === '2'" shadow @clickLeft="clickLeftBack" color="#fff" background-color="#52B5AD" :title="title"
			v-bind="$attrs" @clickRight="clickRightFn" :border="false"></uni-nav-bar>	
		<uni-nav-bar v-else-if="scanType === '1'" background-color="#52B5AD" rightWidth="80px" leftWidth="80px" :border="false">
			<block v-slot:left>
				<view class="city" @click="back">
					<uni-icons type="left" color="#fff" size="20" />
				</view>
			</block>
			<view class="uni-navbar__headerTitle">
				<text>{{title}}</text>
			</view>
			<block v-slot:right>
				<view v-if="rightType == '0'" class="navBar-rightBox" @click="clickRightFn">
					<image class="navBar-rightBox-icon" src="../../static/navBar-rightIcon.png" alt="" />
					{{$t('distributedEnter.scanRecord')}}
				</view>
				<view v-else class="navBar-rightBox" @click="clickRightFn">
					{{$t('distributedEnter.historicalRecord')}}
				</view>
			</block>
		</uni-nav-bar>
	</view>
</template>

<script setup>
	import {
		defineProps
	} from 'vue'
	import {
		navigateBack
	} from '@/utils/routerSkip.js'
	const emit = defineEmits(['clickRight','clickLeftBack']);
	const props = defineProps({
		// 左侧区域点击是否触发自定义事件
		type: {
			type: String,
			default: '0'
		},
		rightType: {
			type: String,
			default: '0'
		},
		scanType: {
			type: String,
			default: '0'
		},
		title: {
			type: String,
			default: ''
		},
		leftType: {
			type: String,
			default: '0'
		}, // lefttype标识左侧返回是不是自定建议  0 不是 1 是
	})
	const back = () => {
		if (props.type == 0) {
			if(props.leftType == '0'){
				navigateBack()
			}else{
				emit('clickLeftBack')
			}
			
		}
	}
	const clickLeftBack = ()=>{
		emit('c')
	}
	const clickRightFn = () => {
		emit('clickRight')
	}
</script>

<style lang="scss">

	.uni-navbar__headerTitle {
		display: flex;
		flex: 1;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		font-size: 28rpx;
		overflow: hidden;
		color: #fff;
	}
	.navBar-rightBox{
		display: flex;
		flex: 1;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		font-size: 24rpx;
		overflow: hidden;
		color: #fff;
		.navBar-rightBox-icon{
			width: 40rpx;
			height: 40rpx;
		}
	}
	// .navBarCustom{
	// 	position: fixed;
	// 	top: 0rpx;
	// 	width: 100%;
	// 	left: 0rpx;
	// }
</style>
